<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>图片增加</title>
<base href="<%=basePath%>">
<link rel="stylesheet" type="text/css"
	href="<%=basePath%>res/lsj/js/layui/css/layui.css" media="all">
<style type="text/css">
	body{
		margin:20px 0px;
	}
</style>
</head>
<body>
	<fieldset class="layui-elem-field layui-field-title"
		style="margin-top: 20px;">
		<legend>增加图片</legend>
	</fieldset>

	<form class="layui-form" action="<%=basePath%>fodPic/add" method="post">
		<div class="layui-form-item">
			
			<div class="layui-inline">
				<label class="layui-form-label">业务ID</label>
				<div class="layui-input-inline">
					<input type="text" name="bus_id" id="busId" required
						lay-verify="required" placeholder="业务ID" maxlength="9"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			
		</div>
		
		<div class="layui-form-item">
			
			<div class="layui-inline">
				<label class="layui-form-label">图片名称</label>
				<div class="layui-input-inline">
					<input type="text" name="pic_name" id="picName" required
						lay-verify="required" placeholder="图片名称" maxlength="9"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			
		</div>
		
		<div class="layui-form-item">
			
			<div class="layui-inline">
				<div class="layui-upload">
					<label class="layui-form-label">上传图片</label>
					<button type="button" class="layui-btn" id="test1">上传图片</button>
					<div class="layui-upload-list" style="margin:10px 54%;">
						<img class="layui-upload-img" id="demo1" width="90px" height="90px">
						<p id="demoText" style="width:120px;margin:10px 0px;"></p>
						<input type="hidden" id="picSite" name="pic_site">
					</div>
				</div>
			</div>
			
		</div>
		
		<div class="layui-form-item">
			
			<div class="layui-inline">
				<label class="layui-form-label">图片备注</label>
				<div class="layui-input-inline">
					<input type="text" name="pic_remark" id="picRemark" required
						lay-verify="required" placeholder="图片备注" maxlength="9"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			
		</div>
		
		<div class="layui-form-item">
			<label class="layui-form-label">是否有效</label>
			<div class="layui-input-block">
				<select name="isva" id="isva" required lay-verify="required"
					autocomplete="off" class="layui-input">
					<option></option>
					<option value="0">无效</option>
					<option value="1">有效</option>
				</select>
			</div>
		</div>
		
		<!-- 
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">操作时间</label>
				<div class="layui-input-inline">
					<input type="date" name="optime" id="optime" required
						lay-verify="required" maxlength="11" placeholder="操作时间"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			-->
			<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">操作人</label>
				<div class="layui-input-inline">
					<input type="text" name="oper" id="oper" required
						lay-verify="required" maxlength="11" placeholder="操作人"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			
			<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">排序</label>
				<div class="layui-input-inline">
					<input type="int" name="sort" id="sort" required
						lay-verify="required" maxlength="11" placeholder="排序"
						autocomplete="off" class="layui-input">
				</div>
			</div>
		
		<div class="layui-form-item">
			<div class="layui-input-block">
				<input type="submit" class="layui-btn" lay-submit=""
					lay-filter="Add" value="立即增加">
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
	</form>
	<script src="<%=basePath%>res/lsj/js/layui/layui.js" charset="utf-8"></script>
	<script type="text/javascript">
		
	layui.use(['form','upload'] ,function(){
		  var form = layui.form
		  ,layer = layui.layer
		  ,$ = layui.$
		  ,upload = layui.upload;
		  
		  form.on('submit(Add)',function(){
			  parent.location.reload(); // 父页面刷新
		  });
		  
		  //普通图片上传
		 upload.render({
		    elem: '#test1'
		    ,url: '<%=basePath %>upload/uploadFile'
		    ,before: function(obj){
		      //预读本地文件示例，不支持ie8
		      obj.preview(function(index, file, result){
		        $('#demo1').attr('src', result); //图片链接（base64）
		      });
		    }
		    ,done: function(res){
		      //如果上传失败
		      if(res.code > 0){
		        return layer.msg('上传失败');
		      }
		      //上传成功
		      $("#picSite").val(res.url);
		    }
		    ,error: function(){
		      //演示失败状态，并实现重传
		      var demoText = $('#demoText');
		      demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
		      demoText.find('.demo-reload').on('click', function(){
		        uploadInst.upload();
		      });
		    }
		  });
		  
		});
	</script>
</body>
</html>